import React from 'react';
import { StyleSheet, Text, View,Button,Image ,ViewPagerAndroid} from 'react-native';

import { StackNavigator } from 'react-navigation';
import EditView from './components/EditView';
var Dimensions = require('Dimensions');

export default class ChatScreen extends React.Component {
    constructor(props) {
        super(props);
        this.userName = "";
        this.password = "";
        this.verifyCode = "";
    }
  static navigationOptions = {
    title: 'Chat with',
  };
  render() {
      const { params } = this.props.navigation.state;
    return (


        <View style={styles.viewPager}>

          <Image source={require('./images/tt_bg.jpg')} style={styles.backs} />

        <EditView name="请输入用户名" srcs={require("./images/ico-my.png")} isDisplay="none" pColor="#FFF" isPwd={false}
                  onChangeText={(text)=>{
                     this.setTextes(text);
                  }}
                  />
          <EditView name="请输入验证码" srcs={require("./images/ico-my1.png")} isDisplay="flex" pColor="#FFF" isPwd={false}
                    onChangeText={(text)=>{
                        this.verifyCode=text;
                    }
              }
              onPressCallback={this.sendCode.bind(this)}
          />
          <EditView name="请输入密码" srcs={require("./images/icon-pw.png")} isDisplay="none" pColor="#FFF" isPwd={true}
                    onChangeText={(text)=>{
                        this.password=text;
                    }
                    }
          />

          </View>


    );
  }
  goToThird(){

      const { navigate } = this.props.navigation;
      navigate('Third', { user: 'han' })
  }
    sendCode(){
       var _usr=this.userName,
           regs=/^(13|14|15|16|17|18|19)(\d{9})$/g;
       if(regs.test(_usr)){
           alert("发送验证码")
       }else{
           alert("请填入正确的验证码");
       }
    }
    setTextes(t){
        this.userName=t;
    }
}






const styles = StyleSheet.create({
    viewPager: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center'
  },
  buttonColor:{
  
    color:'#FFF',
    alignItems: 'center'
  },
    backs:{
        position:"absolute",
        width:Dimensions.get("window").width,
        height:Dimensions.get("window").height,
        backgroundColor:'rgba(0,0,0,0)',
        justifyContent:'flex-end',
        alignItems:'center',
        paddingBottom:50,
    }
});